<!DOCTYPE html>
<!-- saved from url=(0044)landing.html -->
<html lang="en"
	class=" js no-touch no-android chrome no-firefox no-iemobile no-ie no-ie10 no-ie11 no-ios no-ios7 ipad">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<title>Notebook | Web Application</title>
<meta name="description"
	content="app, web app, responsive, admin dashboard, admin, flat, flat ui, ui kit, off screen nav">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="./landing_files/font.css" type="text/css">
<link rel="stylesheet" href="./landing_files/landing.css"
	type="text/css">
<link rel="stylesheet" href="./landing_files/app.v1.css" type="text/css">
<!--[if lt IE 9]> <script src="js/ie/html5shiv.js"></script> <script src="js/ie/respond.min.js"></script> <script src="js/ie/excanvas.js"></script> <![endif]-->
</head>
<body class="" style="">
	<!-- header -->
	<header id="header"
		class="navbar navbar-fixed-top bg-white box-shadow b-b b-light affix-top"
		data-spy="affix" data-offset-top="1">
		<div class="container">
			<div class="navbar-header">
				<a href="landing.html#" class="navbar-brand"><img
					src="./landing_files/logo.png" class="m-r-sm"><span
					class="text-muted">Notebook</span></a>
				<button class="btn btn-link visible-xs" type="button"
					data-toggle="collapse" data-target=".navbar-collapse">
					<i class="fa fa-bars"></i>
				</button>
			</div>
			<div class="collapse navbar-collapse">
				<ul class="nav navbar-nav navbar-right">
					<li class="active"><a href="landing.html">Home</a></li>
					<li><a href="features.html">Features</a></li>
					<li><a href="price.html">Plans &amp; Pricing</a></li>
					<li><a href="blog.html">Blog</a></li>
					<li>
						<div class="m-t-sm">
							<a href="login.jsp" class="btn btn-link btn-sm">Sign in</a> <a
								href="signup.html" class="btn btn-sm btn-success m-l"><strong>Sign
									up</strong></a>
						</div>
					</li>
				</ul>
			</div>
		</div>
	</header>
	<!-- / header -->
	<section id="content">
		<div class="bg-primary dk">
			<div class="text-center wrapper">
				<div class="m-t-xl m-b-xl">
					<div class="text-uc h1 font-bold inline">
						<div class="pull-left m-r-sm text-white">
							Web Application <span class="font-thin text-muted">Built</span>
						</div>
						<div
							class="carousel slide carousel-fade inline auto aside text-left pull-left pull-none-xs"
							data-interval="2000">
							<div class="carousel-inner">
								<div class="item text-warning">Easier</div>
								<div class="item text-dark active left">Faster</div>
								<div class="item next left">Funny</div>
							</div>
						</div>
					</div>
					<div class="h4 text-muted m-t-sm">Modern, Clean &amp; Flat
						User Interface Kit Made with Love &amp; Passion</div>
				</div>
				<p class="text-center m-b-xl">
					<a
						href="http://themeforest.net/user/Flatfull/portfolio?ref=flatfull"
						target="_blank" class="btn btn-lg btn-dark m-sm">Download it</a> <a
                        href="index.jsp" target="_blank"
                        class="btn btn-lg btn-warning b-white bg-empty m-sm">Live
						Preview</a>
				</p>
			</div>
			<div class="padder">
				<div class="hbox">
					<aside class="col-md-3 v-bottom text-right">
						<div class="hidden-sm hidden-xs">
							<section
								class="panel bg-dark inline m-b-n-lg m-r-n-lg aside-sm no-border device phone animated fadeInLeftBig">
								<header class="panel-heading text-center">
									<i class="fa fa-minus fa-2x m-b-n-xs block"></i>
								</header>
								<div>
									<div class="m-l-xs m-r-xs">
										<img src="./landing_files/phone-2.png" class="img-full">
									</div>
								</div>
							</section>
						</div>
					</aside>
					<aside class="col-sm-10 col-md-6">
						<section
							class="panel bg-dark m-b-n-lg no-border device animated fadeInUp">
							<header class="panel-heading text-left">
								<i class="fa fa-circle fa-fw"></i> <i class="fa fa-circle fa-fw"></i>
								<i class="fa fa-circle fa-fw"></i>
							</header>
							<img src="./landing_files/main.png" class="img-full">
						</section>
					</aside>
					<aside class="col-md-3 v-bottom">
						<div class="hidden-sm hidden-xs">
							<section
								class="panel bg-light m-b-n-lg m-l-n-lg aside no-border device phone animated fadeInRightBig">
								<header class="panel-heading text-center">
									<i class="fa fa-minus fa-2x text-white m-b-n-xs block"></i>
								</header>
								<div class="">
									<div class="m-l-xs m-r-xs">
										<img src="./landing_files/phone-1.png" class="img-full">
									</div>
								</div>
							</section>
						</div>
					</aside>
				</div>
			</div>
			<div class="dker pos-rlt">
				<div class="container wrapper">
					<div class="m-t-lg m-b-lg text-center">For your faster and
						easier web development.</div>
				</div>
			</div>
		</div>
		<div id="about">
			<div class="container">
				<div class="m-t-xl m-b-xl text-center wrapper">
					<h3>Responsive web application and admin dashboard template</h3>
					<p class="text-muted">This web based app template give you much
						power to build your great application.</p>
				</div>
				<div class="row m-t-xl m-b-xl text-center">
					<div class="col-sm-4 fadeInLeft animated" data-ride="animated"
						data-animation="fadeInLeft" data-delay="300">
						<p class="h3 m-b-lg">
							<i class="fa fa-lightbulb-o fa-3x text-info"></i>
						</p>
						<div class="">
							<h4 class="m-t-none">Web Application</h4>
							<p class="text-muted m-t-lg">Many mobile app widgets and
								components, it's fully responsive, it can run on all the size of
								the screens. Start work on your great idea today!</p>
						</div>
					</div>
					<div class="col-sm-4 fadeInLeft animated" data-ride="animated"
						data-animation="fadeInLeft" data-delay="600">
						<p class="h3 m-b-lg">
							<i class="fa fa-signal fa-3x text-info"></i>
						</p>
						<div class="">
							<h4 class="m-t-none">Admin Dashboard</h4>
							<p class="text-muted m-t-lg">It also can be used as admin
								dashboard, it has tables, charts and other useful components for
								system management, graph data shows and analysis.</p>
						</div>
					</div>
					<div class="col-sm-4 fadeInLeft animated" data-ride="animated"
						data-animation="fadeInLeft" data-delay="900">
						<p class="h3 m-b-lg">
							<i class="fa fa-rocket fa-3x text-info"></i>
						</p>
						<div class="">
							<h4 class="m-t-none">App Landing</h4>
							<p class="text-muted m-t-lg">This template also have a front
								end site that for your application landing, It have the features
								introduction, blog section, and a price table included.</p>
						</div>
					</div>
				</div>
				<div class="m-t-xl m-b-xl text-center wrapper">
					<p class="h5">
						You can use it to build your <span class="text-primary">Content
							manage system</span>, <span class="text-primary">Travel app</span>, <span
							class="text-primary">Medical app</span>...
					</p>
				</div>
			</div>
		</div>
		<div id="responsive" class="bg-dark">
			<div class="text-center">
				<div class="container">
					<div class="m-t-xl m-b-xl wrapper">
						<h3 class="text-white">Your application will works no matter
							where you are</h3>
						<p>
							You can use your application at anywhere in the world. <br>This
							template works on <span class="text-primary text-ul">mobile
								device</span> too.
						</p>
					</div>
					<div class="row m-t-xl m-b-xl">
						<div class="col-sm-4 wrapper-xl fadeInLeft animated"
							data-ride="animated" data-animation="fadeInLeft" data-delay="300">
							<p class="text-center h2 m-b-lg m-t-lg">
								<span class="fa-stack fa-2x"> <i
									class="fa fa-circle fa-stack-2x text-dark"></i> <i
									class="fa fa-mobile fa-stack-1x text-muted"></i>
								</span>
							</p>
							<p>Mobile</p>
						</div>
						<div class="col-sm-4 wrapper-xl fadeInLeft animated"
							data-ride="animated" data-animation="fadeInLeft" data-delay="600">
							<p class="text-center h1 m-b-lg">
								<span class="fa-stack fa-2x"> <i
									class="fa fa-circle fa-stack-2x text-dark"></i> <i
									class="fa fa-tablet fa-stack-1x text-muted"></i>
								</span>
							</p>
							<p>Tablet</p>
						</div>
						<div class="col-sm-4 wrapper-xl fadeInLeft animated"
							data-ride="animated" data-animation="fadeInLeft" data-delay="900">
							<p class="text-center h2 m-b-lg m-t-lg">
								<span class="fa-stack fa-2x"> <i
									class="fa fa-circle fa-stack-2x text-dark"></i> <i
									class="fa fa-desktop fa-stack-1x text-muted text-md"></i>
								</span>
							</p>
							<p>Desktop</p>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div id="newsletter" class="bg-white clearfix wrapper-lg">
			<div class="container text-center m-t-xl m-b-xl fadeIn animated"
				data-ride="animated" data-animation="fadeIn">
				<h2>Newsletter</h2>
				<p>Do not want to miss anything? Subscribe to our newsletter box</p>
				<form class="form-inline m-t-xl m-b-xl">
					<div class="form-group">
						<input class="form-control input-lg appear"
							placeholder="Your email" data-ride="animated"
							data-animation="fadeInLeftBig" data-delay="300">
					</div>
					<button type="submit" class="btn btn-default btn-lg appear"
						data-ride="animated" data-animation="fadeInRightBig"
						data-delay="600">Subscribe</button>
				</form>
			</div>
		</div>
	</section>
	<!-- footer -->
	<footer id="footer">
		<div class="bg-primary text-center">
			<div class="container wrapper">
				<div class="m-t-xl m-b">
					For your faster and easier web development. <a
						href="http://themeforest.net/user/Flatfull/portfolio?ref=flatfull"
						target="_blank" class="btn btn-lg btn-dark b-white bg-empty m-sm">Download
						it</a> <a href="index.jsp" target="_blank"
                                  class="btn btn-lg btn-warning b-white bg-empty m-sm">Live
						Preview</a>
				</div>
			</div>
			<i class="fa fa-caret-down fa-4x text-primary m-b-n-lg block"></i>
		</div>
		<div class="bg-dark dker wrapper">
			<div class="container text-center m-t-lg">
				<div class="row m-t-xl m-b-xl">
					<div class="col-sm-4 appear" data-ride="animated"
						data-animation="fadeInLeft" data-delay="300">
						<i class="fa fa-map-marker fa-3x icon-muted"></i>
						<h5 class="text-uc m-b m-t-lg">Find Us</h5>
						<p class="text-sm">
							23 soe Midlokls <br> 120002 Loki — UNITED KINGDOM
						</p>
					</div>
					<div class="col-sm-4 appear" data-ride="animated"
						data-animation="fadeInUp" data-delay="600">
						<i class="fa fa-envelope-o fa-3x icon-muted"></i>
						<h5 class="text-uc m-b m-t-lg">Mail Us</h5>
						<p class="text-sm">
							<a href="mailto:hey@example.com">info@example.com</a>
						</p>
					</div>
					<div class="col-sm-4 appear" data-ride="animated"
						data-animation="fadeInRight" data-delay="900">
						<i class="fa fa-globe fa-3x icon-muted"></i>
						<h5 class="text-uc m-b m-t-lg">Join Us</h5>
						<p class="text-sm">
							Send your resume to <br>
							<a href="mailto:hey@example.com">recruit@example.com</a>
						</p>
					</div>
				</div>
				<div class="m-t-xl m-b-xl">
					<p>
						<a href="landing.html#"
							class="btn btn-icon btn-rounded btn-facebook bg-empty m-sm"><i
							class="fa fa-facebook"></i></a> <a href="landing.html#"
							class="btn btn-icon btn-rounded btn-twitter bg-empty m-sm"><i
							class="fa fa-twitter"></i></a> <a href="landing.html#"
							class="btn btn-icon btn-rounded btn-gplus bg-empty m-sm"><i
							class="fa fa-google-plus"></i></a>
					</p>
					<p>
						<a href="landing.html#content" data-jump="true"
							class="btn btn-icon btn-rounded btn-dark b-dark bg-empty m-sm text-muted"><i
							class="fa fa-angle-up"></i></a>
					</p>
				</div>
			</div>
		</div>
	</footer>
	<!-- / footer -->
	<!-- Bootstrap -->
	<!-- App -->
	<script src="./landing_files/app.v1.js"></script>
	<script src="./landing_files/jquery.appear.js"></script>
	<script src="./landing_files/smoothscroll.js"></script>
	<script src="./landing_files/landing.js"></script>
	<script src="./landing_files/app.plugin.js"></script>
</body>
</html>